import { NavBar } from "antd-mobile";
import React, { useEffect, useState } from "react";
import { singleAPI } from "../services/products";
import { useLocation } from "react-router-dom";

function Detaildoctor() {
  const location = useLocation();

  const num = location.state;
  // console.log(num);

  const back = () => {
    history.back();
  };
  const [datum, setdatum] = useState([]);
  useEffect(() => {
    singleAPI(num).then((res) => {
      console.log(res.data);
      // @ts-ignore
      setdatum([res.data]);
      // console.log(datum);
    });
  }, []);
  return (
    <div>
      <div className="dtheader">
        <NavBar onBack={back}>详情页</NavBar>
      </div>

      <div className="detailcent">
        {datum.map((item) => {
          return (
            <div>
              <div className="dct">
                {/* @ts-ignore */}
                <img src={item.avatar} alt="" />
                <div className="dlp">
                  {/* @ts-ignore */}

                  <p>姓名：{item.name}</p>
                  <p>
                    职称：
                    {/* @ts-ignore */}
                    {item.doctorTitleInfo ? item.doctorTitleInfo.name : "暂无"}
                  </p>

                  <p>
                    科室：
                    {/* @ts-ignore */}
                    {item.departmentInfo ? item.departmentInfo.name : "暂无"}
                  </p>
                </div>
              </div>
              <div className="desc">
                <p style={{ color: "red" }}>擅长：</p>
                {/* @ts-ignore */}
                <p className="descl"> {item.desc}</p>
              </div>
            </div>
          );
        })}
      </div>
    </div>
  );
}

export default Detaildoctor;
